﻿<!DOCTYPE html>
<html>

<head>
    <meta charset = "utf-8">
    <!-- 引入 ECharts 文件 -->
    <script src = "js/echarts.js"></script>

</head>

<body>
    <!---为ECharts准备一个具备大小（宽高）的DOM--->
    <div id = "main" style = "width: 800px; height: 600px"></div>
    <script type = "text/javascript">
        //基于准备好的DOM，初始化ECharts图表
        var myChart = echarts.init(document.getElementById("main"));
        //指定图表的配置项和数据
        var option = {
            title: { x: 222, text: '男性和女性身高、体重分布' },
            color: ['blue', 'green'],
            xAxis: { scale: true, name: '身高(cm)', color: 'red' },
            yAxis: { scale: true, name: '体重(kg)' },
            series: [{
                type: 'scatter', symbolSize: 20,
                data: [
                    [167.0, 64.6], [177.8, 74.8], [159.5, 58.0], [169.5, 68.0],
                    [163.0, 63.6], [157.5, 53.2], [164.5, 65.0], [163.5, 62.0],
                    [171.2, 65.1], [161.6, 58.9], [167.4, 67.7], [167.5, 63.0],
                    [181.1, 76.0], [165.0, 60.2], [174.5, 70.0], [171.5, 68.0],],
            }],
        };
        //使用刚指定的配置项和数据显示图表
        myChart.setOption(option); 
    </script>
</body>

</html>